<% if (plugins.leetcode) { %>
  <section>
    <h2 class="field">
      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2.5 3.5v3h3v-3h-3zM2 2a1 1 0 00-1 1v4a1 1 0 001 1h4a1 1 0 001-1V3a1 1 0 00-1-1H2zm4.655 8.595a.75.75 0 010 1.06L4.03 14.28a.75.75 0 01-1.06 0l-1.5-1.5a.75.75 0 111.06-1.06l.97.97 2.095-2.095a.75.75 0 011.06 0zM9.75 2.5a.75.75 0 000 1.5h5.5a.75.75 0 000-1.5h-5.5zm0 5a.75.75 0 000 1.5h5.5a.75.75 0 000-1.5h-5.5zm0 5a.75.75 0 000 1.5h5.5a.75.75 0 000-1.5h-5.5z"></path></svg>
      LeetCode statistics <% if (plugins.leetcode?.user) { %>for <%= plugins.leetcode.user %><% } %>
    </h2>
    <% if (plugins.leetcode.error) { %>
      <div class="row">
        <section>
          <div class="field error">
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2.343 13.657A8 8 0 1113.657 2.343 8 8 0 012.343 13.657zM6.03 4.97a.75.75 0 00-1.06 1.06L6.94 8 4.97 9.97a.75.75 0 101.06 1.06L8 9.06l1.97 1.97a.75.75 0 101.06-1.06L9.06 8l1.97-1.97a.75.75 0 10-1.06-1.06L8 6.94 6.03 4.97z"></path></svg>
            <%= plugins.leetcode.error.message %>
          </div>
        </section>
      </div>
    <% } else { %>
      <% if (plugins.leetcode.sections.includes("solved")) { %>
        <section>
          <div class="row fill-width leetcode scores">
            <section class="categories">
              <% for (const difficulty of ["All", "Easy", "Medium", "Hard"]) { const problems = plugins.leetcode.problems[difficulty], width = 440 * (1 + large) %>
                <div class="category column">
                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 120" width="50" height="50" class="gauge <%= difficulty.toLocaleLowerCase() %>">
                    <circle class="gauge-base" r="53" cx="60" cy="60"></circle>
                    <circle class="gauge-arc" transform="rotate(-90 60 60)" r="53" cx="60" cy="60" stroke-dasharray="<%= (problems.solved/problems.count) * 329 %> 329"></circle>
                    <text x="60" y="50" dominant-baseline="central"><%= problems.solved %></text>
                    <text x="60" y="80" dominant-baseline="central" class="secondary">/<%= problems.count %></text>
                  </svg>
                  <span class="title"><%= difficulty %></span>
                </div>
              <% } %>
            </section>
          </div>
        </section>
      <% } %>
      <% if (plugins.leetcode.sections.includes("skills")) { %>
        <section class="leetcode subsection">
          <h2 class="field">
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2.5 7.775V2.75a.25.25 0 01.25-.25h5.025a.25.25 0 01.177.073l6.25 6.25a.25.25 0 010 .354l-5.025 5.025a.25.25 0 01-.354 0l-6.25-6.25a.25.25 0 01-.073-.177zm-1.5 0V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 010 2.474l-5.026 5.026a1.75 1.75 0 01-2.474 0l-6.25-6.25A1.75 1.75 0 011 7.775zM6 5a1 1 0 100 2 1 1 0 000-2z"></path></svg>
            Skills
          </h2>
          <div class="topics">
            <% for (const {name, solved, category} of plugins.leetcode.skills) { %>
              <div class="label <%= category %>"><span class="dot">⬤</span> <%= name %> <span class="count">x<%= solved%></span></div>
            <% } %>
          </div>
        </section>
      <% } %>
      <% if (plugins.leetcode.sections.includes("recent")) { %>
        <section class="leetcode subsection">
          <h2 class="field">
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2.5 1.75a.25.25 0 01.25-.25h8.5a.25.25 0 01.25.25v7.736a.75.75 0 101.5 0V1.75A1.75 1.75 0 0011.25 0h-8.5A1.75 1.75 0 001 1.75v11.5c0 .966.784 1.75 1.75 1.75h3.17a.75.75 0 000-1.5H2.75a.25.25 0 01-.25-.25V1.75zM4.75 4a.75.75 0 000 1.5h4.5a.75.75 0 000-1.5h-4.5zM4 7.75A.75.75 0 014.75 7h2a.75.75 0 010 1.5h-2A.75.75 0 014 7.75zm11.774 3.537a.75.75 0 00-1.048-1.074L10.7 14.145 9.281 12.72a.75.75 0 00-1.062 1.058l1.943 1.95a.75.75 0 001.055.008l4.557-4.45z"></path></svg>
            Recent submissions
          </h2>
          <% for (const {title, date} of plugins.leetcode.recent) { %>
            <div class="field">
              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M8 5.5a2.5 2.5 0 100 5 2.5 2.5 0 000-5zM4 8a4 4 0 118 0 4 4 0 01-8 0z"></path></svg>
              <div class="infos">
                <div class="title"><%= title %></div>
                <div class="date"><%= f.date(new Date(date), {date:true, timeZone:config.timezone?.name}) %></div>
              </div>
            </div>
          <% } %>
        </section>
      <% } %>
    <% } %>
  </section>
<% } %>
